var msMessage = new i18nMessage('../../servlet/I18nMessageServlet?keyPrefix=ui.measurespecification');
var ctStature = new i18nMessage('../../servlet/CodeTableServlet?name=CtStature');
var ctCollar = new i18nMessage('../../servlet/CodeTableServlet?name=CtCollarType');
var referenceStore;
var referenceGrid;
var referenceWindow;

var selectReference = function(selectCallback){
    if (!referenceWindow) {
        referenceWindow = new Ext.Window({
            title: message.get('message.combo.pleaseselect'),
            layout: 'fit',
            width: 800,
            height: 605,
            closeAction: 'hide',
            plain: true,
            modal: true,
            items: [{
                id: 'referencePanel',
                region: 'center',
                bodyStyle: {
                    background: '#ffffff',
                    padding: '7px'
                },
                html: '<div id="referenceDiv"></div>'
            }]
        });
    }
    referenceWindow.show();
    
    if (referenceGrid) 
        return;
    referenceStore = new Ext.data.Store({
        url: '../../servlet/BiReferenceServlet?action=4',
        
        reader: new Ext.data.XmlReader({
            record: 'item',
            id: 'id',
            totalRecords: 'itemTotal'
        }, ['index', 'ctMachineType', 'ctMachineTypeCode', 'weight', 'reference', 'needle', 'front', 'back', 'sleeves', 'bottomThrum', 'sleevesThrum', 'necklineThrum', 'comment', 'frontPhotoName', 'backPhotoName', 'otherPhotoName', 'id']),
        remoteSort: true
    });
    
    referenceStore.setDefaultSort('id', 'desc');
    
    var filters = new Ext.grid.GridFilters({
        filters: [{
            type: 'string',
            dataIndex: 'reference'
        }]
    });
    
    function renderSelectItem(value, p, record){
		//var selectReferenceCallback = function(id,reference, needle,ctMachineType, weight,front,back,
		//sleeves,bottomThrum,sleevesThrum,necklineThrum,frontPhotoName,backPhotoName,otherPhotoName){
        return String.format('<a href="javascript: selectReferenceCallback(\'{0}\', \'{1}\', \'{2}\', \'{3}\', \'{4}\',\'{5}\', \'{6}\', \'{7}\', \'{8}\', \'{9}\',\'{10}\', \'{11}\', \'{12}\', \'{13}\');referenceWindow.hide();"><img src="../../images/icons/arrow_rotate_clockwise.png" title="' + message.get('message.list.select') + '" /></a>', 
								record.data.id, 
								record.data.reference,
								record.data.needle,
								record.data.ctMachineTypeCode,
								record.data.weight,
								record.data.front, 
								record.data.back,
								record.data.sleeves,
								record.data.bottomThrum,
								record.data.sleevesThrum,
								record.data.necklineThrum,
								record.data.frontPhotoName,
								record.data.backPhotoName,
								record.data.otherPhotoName);
    }
	
	var referenceExpander = new Ext.grid.RowExpander({
			        tpl : new Ext.Template(
			            '<p><b>' + referenceMessage.get('ui.reference.front') + ':</b> {front} &nbsp;&nbsp;&nbsp;&nbsp; <b>' + referenceMessage.get('ui.reference.back') + ':</b> {back}&nbsp;&nbsp;&nbsp;&nbsp;',
						'<b>' + referenceMessage.get('ui.reference.sleeves') + ':</b> {sleeves} &nbsp;&nbsp;&nbsp;&nbsp; <b>' + referenceMessage.get('ui.reference.bottomthrum') + ':</b> {bottomThrum}&nbsp;&nbsp;&nbsp;&nbsp;',
						'<b>' + referenceMessage.get('ui.reference.sleevesthrum') + ':</b> {sleevesThrum} &nbsp;&nbsp;&nbsp;&nbsp; <b>' + referenceMessage.get('ui.reference.necklinethrum') + ':</b> {necklineThrum}&nbsp;&nbsp;&nbsp;&nbsp;</p><br/>',
			            '<p><b>' + referenceMessage.get('ui.reference.needle') + ':</b> {needle} &nbsp;&nbsp;&nbsp;&nbsp; <b>' + referenceMessage.get('ui.reference.machinetype') + ':</b> {ctMachineType}&nbsp;&nbsp;&nbsp;&nbsp;',
						'<b>' + referenceMessage.get('ui.reference.weight') + ':</b> {weight} &nbsp;&nbsp;&nbsp;&nbsp; <b>' + piMessage.get('ui.productidentification.yarnnumber') + ':</b> {yarnNumber}&nbsp;&nbsp;&nbsp;&nbsp;',
						'</p><br/>',
						'<p>&nbsp;&nbsp;&nbsp;&nbsp;<img src="../../_temp/{frontPhotoName}" width="150px"/>&nbsp;&nbsp;&nbsp;&nbsp;<img src="../../_temp/{backPhotoName}" width="150px"/>&nbsp;&nbsp;&nbsp;&nbsp;<img src="../../_temp/{otherPhotoName}" width="150px"/></p><br/>',
						'<p><b>' + message.get('message.edit.comment') + ':</b> {comment}</p><br/>'
			        )
			    });
    // create the grid
    referenceGrid = new Ext.grid.GridPanel({
        title: referenceMessage.get('ui.reference.listtitle'),
        store: referenceStore,
        stripeRows: true,
        plugins: [filters, referenceExpander],
        height: 560,
        columns: [referenceExpander, {
            header: message.get('message.list.id'),
            width: 30,
            dataIndex: 'index',
            sortable: false
        }, {
            header: referenceMessage.get('ui.reference.reference'),
            width: 80,
            dataIndex: 'reference',
            sortable: true
        }, {
            header: referenceMessage.get('ui.reference.needle'),
            dataIndex: 'needle',
            sortable: true
        }, {
            header: referenceMessage.get('ui.reference.machinetype'),
            dataIndex: 'ctMachineType',
            sortable: true
        }, {
            header: referenceMessage.get('ui.reference.weight'),
            dataIndex: 'weight',
            sortable: true
        }, {
            header: referenceMessage.get('ui.reference.front'),
            dataIndex: 'front',
            sortable: true
        }, {
            header: referenceMessage.get('ui.reference.back'),
            dataIndex: 'back',
            sortable: true
        }, {
            header: referenceMessage.get('ui.reference.sleeves'),
            dataIndex: 'sleeves',
            sortable: true
        }, {
            header: referenceMessage.get('ui.reference.bottomthrum'),
            dataIndex: 'bottomThrum',
            sortable: true
        }, {
            header: referenceMessage.get('ui.reference.sleevesthrum'),
            dataIndex: 'sleevesThrum',
            sortable: true
        }, {
            header: referenceMessage.get('ui.reference.necklinethrum'),
            dataIndex: 'necklineThrum',
            sortable: true
        }, {
            header: message.get('message.list.select'),
            width: 30,
            dataIndex: 'id',
            sortable: false,
            renderer: renderSelectItem
        }],
        viewConfig: {
            forceFit: true
        },
        loadMask: true,
        renderTo: 'referenceDiv',
        bbar: new Ext.PagingToolbar({
            pageSize: 20,
            store: referenceStore,
            displayInfo: true
        })
    });
    
    var startPage = getPrarmeterValue(window.location, 'startPage');
    var start;
    if (startPage == null || startPage == '') {
        start = 0;
    }
    else {
        start = (startPage - 1) * 20;
    }
    referenceStore.load({
        params: {
            start: start,
            limit: 20
        }
    });
}

